<!-- background-->
<script type="text/javascript">
        $(document).ready(function() {
            $('#gallery').bgslider({
                images: "["+
					"{ image: '<?php echo base_url()?>templates/images/backgrounds/bg1.jpg', title: 'k2 covered in clouds' },"+
					"{ image: '<?php echo base_url()?>templates/images/backgrounds/bg2.jpg', title: 'k2 covered in clouds' },"+
					"{ image: '<?php echo base_url()?>templates/images/backgrounds/bg3.jpg', title: 'k2 covered in clouds' },"+
					"{ image: '<?php echo base_url()?>templates/images/backgrounds/bg4.jpg', title: 'k2 covered in clouds' },"+
					"{ image: '<?php echo base_url()?>templates/images/backgrounds/bg5.jpg', title: 'k2 covered in clouds' },"+
					"{ image: '<?php echo base_url()?>templates/images/backgrounds/bg6.jpg', title: 'k2 covered in clouds' },"+
					"{ image: '<?php echo base_url()?>templates/images/backgrounds/bg7.jpg', title: 'k2 covered in clouds' }"+
				"]",
                speed: 5000,
                preloadall: false,
				loading: '<?php echo base_url()?>templates/js/backgroundslider/images/loading.gif',
                
            });
        });       
    </script>
<!--end baclground-->

<script type="text/javascript">
 $(document).ready( function(){	
		// buttons for next and previous item						 
		var buttons = { previous:$('#jslidernews1 .button-previous') ,
						next:$('#jslidernews1 .button-next') };
		 $obj = $('#jslidernews1').lofJSidernews( { interval : 4000,
											 	easing			: 'easeInOutQuad',
												duration		: 1200,
												auto		 	: false,
												maxItemDisplay  : 20,
												startItem:0,
												navPosition     : 'horizontal', // horizontal
												navigatorHeight : null,
												navigatorWidth  : null,
												mainWidth:1024,
												buttons:buttons} );		
	});
</script>
<!--scroll to-->
<script language="javascript" src="<?php echo base_url()?>templates/js/vertical-scroll/jquery.mousewheel.js"></script>
<script language="javascript" src="<?php echo base_url()?>templates/js/vertical-scroll/jScrollPane.js"></script>
<link rel="stylesheet" type="text/css" href="<?php echo base_url()?>templates/js/vertical-scroll/css/jScrollPane.css" />
<link rel="stylesheet" type="text/css" href="<?php echo base_url()?>templates/js/vertical-scroll/css/demoStyles.css" />
<!--scroll to-->
<script type="text/javascript">	
			$(function()
			{
				// this initialises the demo scollpanes on the page.
				<?php $i=1; foreach($new as $recruitment) { ?>
				$('#pane<?php echo $i ?>').jScrollPane({showArrows:true});
				<?php $i++; } ?>
			});
</script>

<!------------------------------------- THE CONTENT ------------------------------------------------->
<div id="wrapper">
  <div id="slider">
    <div id="templatemo_wrapper">
      <div class="scroll">
        <div class="scrollContainer">
          <div id="recruitment">
            <div id="jslidernews1" class="lof-slidecontent"> 
              <!-- NAVIGATOR -->
              <div id="box_position_recruit_bg">
                <div id="caption_vitrituyendung"><?php echo $title;?></div>
                <div style=" margin:0px 30px;border:1px #167C99 solid"></div>
                <div class="navigator-wrapper">
                  <ul class="navigator-wrap-inner" style="left:0 !important;">
                  <!-- cho them 1 cai li để thuộc tính ẩn. để cho nó load trang mở đầu   -->
                  <li style="display:none;"><a href="#0">start</a></li>
                  <?php $i=1; foreach($list as $rs) { ?>
                    <li> <span id="tuyendung_item"><a href="#<?php echo $i?>"  class="work"><?php echo $rs->lb_title?></a></span> </li>
                  <?php $i++;?>
           		  <?php }?>  
                  </ul>
                </div>
              </div>
              <!----------------- END OF NAVIGATOR --------------------->
              <div class="preload"></div>
              <!-- MAIN CONTENT -->
              <div class="main-slider-content">
              
              <!--**********************************************************-->
              <!--************      scroll vertical bar        *************-->
              <!--**********************************************************-->
                <ul class="sliders-wrap-inner" >
                    <li id="0" class="start-description">
                    	<!-- khi moi load trang career thi hien len may cai nay.-->
                      <p id="start_title" class="recruitment_start">phát triển sự nghiệp cùng xan</p>
                      <p class="subscript" >Mục tiêu:</p>
                      Bạn không chỉ xây dựng sự nghiệp tại XAN, ở đây bạn còn xây dưng cuộc sống của chính mình.
                      <p class="subscript">Con người:</p>
                      	
                        	Không phải là sự xuất sắc, chúng tôi đề cao sự thân thiện, khiêm tốn và tôn trọng khi bạn đến với XAN.<br/>
                            Dám đón nhận thách thức là một phần tất yếu của tất cả các nhân viên XAN.
                        
                        <p class="subscript">Lực lượng:</p>
                        Với tốc độ phát triển mạnh mẽ, nhân viên của XAN đã tăng từ con số  lên  chỉ trong vòng 2 tháng. Con số này luôn tiếp tục tăng và một trong số những con số đó sẽ là của bạn.
                        <p class="subscript">Môi trường:</p>
                        XAN đã trở thành ngôi nhà thứ 2 của rất nhiều người tại đây, hãy để chúng tôi chào đón bạn như một thành viên mới trong gia đình.
                        <p> XAN luôn chào đón tất cả các ứng viên quan tâm, vui lòng xem các vị trí đang tuyển dụng phía bên trái, trên cùng trang nội dung bạn đang xem.</p>
                      <!---->
                    </li>
                <?php $i=1; foreach($list as $recruitment) { ?>
                
                
                  <li id="<?php echo $i?>" style="margin-left:0 !important;">
                    <div class="slider-description">
                      <div id="title_name"> <img src="<?php echo base_url()?>templates/images/bullet_tuyendung.png" /> TUYỂN DỤNG - <?php echo $recruitment->lb_title;?></div>
                      <hr width="483px" color="#167c99" style="margin-left:15px;"/>
                     
                      
                <div class="holder">
                   <div id="pane<?php echo $i ?>" class="scroll-pane">            
                          <div class="content_recruit">
	                          <?php echo $recruitment->lb_description;?>
                          </div>
                        </div><!--scroll pane-->
                </div><!-- holder -->
                    <?php $i++;?>
                    </div>
                  </li>
                  
                  <?php }?>        
                </ul>
                
              </div>
              <!-- END MAIN CONTENT --> 
              
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>  